import { NIcon, NTag, NSpace, NButton, NPopconfirm } from 'naive-ui';
import DyIcon from '@/components/dy-icon/index.vue';
import Permisstion from '@/components/permission/index.vue';
import { FolderOpenFilled, MenuOutlined, RectangleOutlined } from '@vicons/material';

export default function getColumns(
  openDialog: (row?: any) => void,
  handleDelete: (row: any) => Promise<void>,
) {
  return [
    {
      title: '菜单名称',
      key: 'menuName',
      width: 160,
      ellipsis: { tooltip: true },
    },
    {
      title: '图标',
      key: 'icon',
      width: 100,
      render: (row: any) => (
        <NIcon depth={2} size={17}>
          <DyIcon icon={row.icon} />
        </NIcon>
      ),
    },
    {
      title: '排序',
      key: 'orderNum',
      width: 60,
    },
    {
      title: '权限标识',
      key: 'perms',
      ellipsis: { tooltip: true },
    },
    {
      title: '类型',
      key: 'menuType',
      render: (row: any) => {
        const { menuType } = row;
        const label = menuType === 'M' ? '目录' : menuType === 'C' ? '菜单' : '按钮';
        return (
          <NTag
            type={menuType === 'M' ? 'info' : menuType === 'C' ? 'success' : 'warning'}
            bordered={false}
            size="small"
          >
            {label}
          </NTag>
        );
      },
    },
    {
      title: '组件路径',
      key: 'component',
      ellipsis: { tooltip: true },
    },
    {
      title: '状态',
      key: 'status',
      width: 80,
      render: (row: any) => {
        const status = row.status === '0' ? 'success' : 'error';
        const label = row.status === '0' ? '正常' : '停用';
        return (
          <NTag type={status} size="small">
            {label}
          </NTag>
        );
      },
    },
    {
      title: '创建时间',
      key: 'createTime',
      width: 180,
    },
    {
      title: '操作',
      key: 'actions',
      width: 120,
      render: (row: any) => (
        <NSpace>
          <Permisstion hasPermi={['system:menu:edit']}>
            <NButton text type="primary" size="tiny" onClick={() => openDialog(row)}>
              修改
            </NButton>
          </Permisstion>
          <Permisstion hasPermi={['system:menu:add']}>
            <NButton
              text
              type="primary"
              size="tiny"
              onClick={() => openDialog({ parentId: row.menuId })}
            >
              新增
            </NButton>
          </Permisstion>
          <Permisstion hasPermi={['system:menu:remove']}>
            <NPopconfirm
              positiveText="确定"
              negativeText="取消"
              onPositiveClick={() => handleDelete(row)}
              v-slots={{
                trigger: () => (
                  <NButton text type="error" size="tiny">
                    删除
                  </NButton>
                ),
              }}
            >
              确定删除该菜单吗？
            </NPopconfirm>
          </Permisstion>
        </NSpace>
      ),
    },
  ];
}
